<template>
  <div class="design-header">
    <div class="design-header-box">
      <div class="flex">
        <div class="design-header__left-part">
          <router-link class="design-header__logo" to="/design"></router-link>

          <div class="design-header__file-con">
            文件
            <div class="design-header__file-con__icon"></div>
            <div class="design-header__file-con__hover">
              <ul class="design_file_list">
                <!---->
                <li
                  title="当前尺寸为：426mm × 576mm"
                  class="design_present_size"
                >
                  426mm × 576mm
                  <div class="shoutu">印刷宣传海报</div>
                </li>
                <hr />
                <li class="design_open">查看我的设计</li>
                <li class="design_save">保存</li>
                <li class="design_copy">另存为</li>
                <!---->
                <li>导入PSD文件</li>
                <!---->
                <!---->
                <li class="design_copy design_file_copyright_red_point">
                  参加活动
                </li>
                <li class="design_history">版本历史记录</li>
                <hr />
                <li class="design_change_sence">
                  <span class="posting_mydesign_icon sence-same-icon"></span>
                  <span class="change_sence_title">智能变换设计</span>
                </li>
                <li class="design_set">
                  <span class="posting_mydesign_icon sence-same-icon"></span>
                  <span class="change_sence_title">导入设计</span>
                </li>
              </ul>
            </div>
          </div>

          <div class="design-header__size-con">尺寸调整</div>
          <div
            title="撤销"
            :disabled="undoList.length === 0"
            class="no-focus-backchange design-header__step-undo-con"
            @click="_undo"
          >
            <span class="repeal_img nav-icon "></span>
          </div>
          <div
            title="恢复"
            class="no-focus-backchange design-header__step-redo-con"
            :disabled="redoList.length === 0"
            @click="_redo"
          >
            <span class="regain_img nav-icon "></span>
          </div>
          <div class="design-header__time-con icon-btn">今天 13 : 58 更新</div>
          <div class="design-header__title-con icon-btn"></div>
        </div>
      </div>
      <div class="flex">
        <div class="design-header__left-part" style="margin-right:10px">
          <div class="design-header__size-con">无版权风险</div>
          <div class="design-header__size-con">分享</div>
          <div class="design-header__size-con">下载</div>
        </div>
        <div style="margin-right:10px">
          <el-dropdown split-button type="primary" @click="yinshuaNow()">
            立即印刷
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item>黄金糕</el-dropdown-item>
              <el-dropdown-item>狮子头</el-dropdown-item>
              <el-dropdown-item>螺蛳粉</el-dropdown-item>
              <el-dropdown-item>双皮奶</el-dropdown-item>
              <el-dropdown-item>蚵仔煎</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { mapGetters, mapActions } from "vuex";

export default {
  name: "lxwheader",
  data() {
    return {};
  },
  computed: {
    ...mapGetters(["canvas", "undoList", "redoList"])
  },
  created() {},
  methods: {
    ...mapActions(["undo", "redo"]),

    //撤销
    _undo() {
      if (this.undoList.length > 0) this.undo();
    },
    //反撤销
    _redo() {
      if (this.redoList.length > 0) this.redo();
    },
    yinshuaNow() {
      console.log("立即印刷++++++++++++++++++++++++");
    }
  }
};
</script>

<style lang="less" scoped>
@import "../styles/header/index.less";
</style>
